<template>
	<view class="count" :style="{paddingTop:+statusBarHeight+'px',paddingBottom:'0px'}">
		<view class="" v-if="only">
			<view class="count-view" :style="">
				<text class="icon iconfont icon-zuojiantou2 icon2" @tap="Back(1)"></text>
				<view class="title">
					{{title}}
				</view>
				<text class="icon iconfont icon-icon-chaxun icon1" @tap="chanxunFun"></text>
				<text class="icon iconfont icon-icon-wode icon1" @tap="switchClik"></text>
				<u-overlay :show="show" @tap="show = false" :opacity="0.001">
					<selcect @scancode="scancode"></selcect>
				</u-overlay>
			</view>
			<!--  -->
			<!--   -->
			<messageScroll v-show="hasTop==true&&alertList.length>0"> </messageScroll>
		</view>
		<view class="count-view view-top" v-else>
			<text class="icon iconfont icon-zuojiantou2 icon1" @tap="Back(2)"></text>
			<view class="title">
				{{title}}
			</view>
		</view>
	</view>

</template>

<script>
	import selcect from './selcect.vue'
	import messageScroll from './messageScroll.vue'
	import {
		mapMutations,
		mapState
	} from "vuex";
	export default {
		props: ['only', 'title','hasTop'],
		data() {
			return {
				statusBarHeight: 0, //状态栏高度
				show: false
			};
		},
		components: {
			selcect,
			messageScroll
		},
		computed: {
			...mapState('user', ["alertList"]),
		},
		created() {
			this.statusBarHeight = uni.getSystemInfoSync().platform === 'android' ? plus.navigator.getStatusbarHeight() :
				24; //状态栏高度
		},
		methods: {
			Back(data) {
				//uni.navigateBack()//默认delta:1
				uni.navigateBack({
					delta: 1, //返回层数，2则上上页
				})
			},
			onBackPress() {
				uni.showModal({
					content: '确认退出程序么？',
					success: function(res) {
						if (res.confirm) {
							// 退出当前应用，改方法只在App中生效  
							plus.runtime.quit();
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
				return true;
			},
			switchClik() {
				this.show = true
				// this.$emit('onWodeFun', true);
			},
			chanxunFun() {
				uni.navigateTo({
					url: '../DropDown/search'
				});
			},
			scancode(e) {
				// console.log(e);
				this.show = false
				switch (e) {
					case 0:
						this.$emit('onWodeFun', true)
						return;
					case 1:
						uni.navigateTo({
							url: '../DropDown/bracelet'
						});
						return;
					case 2:
						uni.navigateTo({
							url: '../DropDown/breast'
						});
						return;
					case 3:
						uni.navigateTo({
							url: '../DropDown/search'
						});
						return;
					case 4:
						uni.navigateTo({
							url: '../DropDown/Instrument'
						});
						return;
					case 5:
						uni.navigateTo({
							url: '../DropDown/Surgical'
						});
						return;
					case 6:
						uni.navigateTo({
							url: '../DropDown/Consultation'
						});
						return;
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.count {
		// height: 44px;
		background: #7AD9DF;
		padding: 0 0px 0 13px;
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
		position: relative;
	}

	.count-view {
		
		display: flex;
		align-items: center;
		width: 100%;
		justify-content: space-between;
        margin-bottom: 26rpx;
		.icon1 {
			font-size: 28px !important;
			margin-right: 30rpx;
		}

		.icon2 {
			font-size: 28px !important;
		}

		.title {
			width: 70%;
			font-size: 15px;
			font-family: SourceHanSansCN-Medium, SourceHanSansCN;
			font-weight: 500;
			color: #333333;
			line-height: 27px;
		}
	}

	.view-top {
		justify-content: flex-start !important;
		// padding: 0 0 40rpx;

		.title {
			padding-left: 20px;
			width: 100%;
		}
	}
</style>
